<template>
  <BaseDropdown width-class="w-48" margin-class="mt-1">
    <template #activator>
      <div class="flex items-center justify-center">
        <BaseIcon name="EllipsisHorizontalIcon" class="w-6 h-6 text-gray-600" />
      </div>
    </template>

    <BaseDropdownItem :path="`document/${row.id}/edit`">
      <BaseIcon name="PencilIcon"
        class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500 inline"
        aria-hidden="true"
      />
      {{ t('general.edit') }}
    </BaseDropdownItem>

    <BaseDropdownItem @click="handleViewPdf(row.id)">
      <BaseIcon name="EyeIcon"
        class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500 inline"
        aria-hidden="true"
      />
      {{ t('general.view_pdf') }}
    </BaseDropdownItem>

    <BaseDropdownItem @click="delDocument(row.id)">
      <BaseIcon name="TrashIcon"
        class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500"
        aria-hidden="true"
      />
      {{ t('general.del') }}
    </BaseDropdownItem>  
  </BaseDropdown>

  <DocumentViewPdfModal/>
</template>

<script setup>
import { useDialogStore } from '@/stores/components/dialog'
import { useI18n } from 'vue-i18n'
// pinia
import { useNotificationStore } from '@/stores/components/notification'
import { useDocumentStore } from '@/stores/document'
import { useModalStore } from '@/stores/components/modal'
// template & modal
import DocumentViewPdfModal from '@/biz-components/modals/DocumentViewPdfModal.vue'

const props = defineProps({
  row: {
    type: Object,
    default: null,
  },
  loadData: {
    type: Function,
    default: null,
  },
})

const dialogStore = useDialogStore()
const { t } = useI18n()
// pinia
const notificationStore = useNotificationStore()
const documentStore = useDocumentStore()
const modalStore = useModalStore()
// 删除
function delDocument(id) {
  console.log('delDocument1111: ', id)

  dialogStore
    .openDialog({
      title: t('general.are_you_sure'),
      message: t('general.confirm_delete'),
      yesLabel: t('general.ok'),
      noLabel: t('general.cancel'),
      variant: 'danger',
      hideNoButton: false,
      size: 'lg',
    })
    .then((res) => {
      if (res) {
        
        // 删除文件
        documentStore.deleteItem({ ids: [id] }).then((response) => {
          console.log('删除文件', response)

          if (response.data.success) {
            notificationStore.showNotification({
              type: 'success',
              message: t('general.action.delete_suc'),
            })


            props.loadData && props.loadData()
            return true
          }
          return true
        })
      }
    })
}

// pdf 显示
function handleViewPdf(id) {
  modalStore.openModal({
    title: t('document.title'),
    componentName: 'DocumentViewPdfModal',
    id,
    size: 'lg',
  })
}

</script>
